<template>
  <div class="leftnav">
        <el-menu class="el-menu-demo" :unique-opened=true :router=true>
         <!-- <el-menu-item index="/main">
          <i class="icon iconfont iconshiyongwendang"></i>首页</el-menu-item> -->

          <template v-for="menu in menus">
            <el-submenu :key="menu.id" :index="menu.id">
              <template slot="title">
                <div class="p" >
                <i :class="`icon iconfont ${menu.icon}`"></i>
                  <span @click="naviagte(menu.key)">{{menu.name}}</span>
                </div>
              </template>
              <el-menu-item
                v-for="child in menu.children"
                :key="child.id"
                :index="child.key"
              >
                {{child.name}}
              </el-menu-item>
            </el-submenu>
          </template>

          <!-- <el-submenu index="1">
            <template slot="title">
              <div class="p" >
              <i class="icon iconfont iconyunyingzhongxin"></i>
              <span @click="push6">农场管理</span>
              </div>
            </template>
            <el-menu-item index="/site_info">场地管理</el-menu-item>
            <el-menu-item index="/product_info">产品管理</el-menu-item>
          </el-submenu>


          <el-submenu index="1">
            <template slot="title">
              <div class="p" >
              <i class="icon iconfont iconyunyingzhongxin"></i>
              <span @click="push">设备管理</span>
              </div>
            </template>
            <el-menu-item index="/device_info">设备状况</el-menu-item>
            <el-menu-item index="/parts_info">零件状况</el-menu-item>
          </el-submenu>
        <el-submenu index="3">
            <template slot="title">
              <i class="icon iconfont iconhezuohuobanmiyueguanli"></i>
                <span @click="push1">用户管理</span>
            </template>
            <el-menu-item index="/user_info">用户状况</el-menu-item>
        </el-submenu>
        <el-submenu index="4">
            <template slot="title">
              <i class="icon iconfont icongongnengdingyi"></i>
                <span @click="push2">系统管理</span>
            </template>
            <el-menu-item index="/system_parameter">系统参数</el-menu-item>
            <el-menu-item index="/runtime">运行管理</el-menu-item>
            <el-menu-item index="/updata">升级管理</el-menu-item>
        </el-submenu>
        <el-submenu index="5">
            <template slot="title">
              <i class="icon iconfont icongaojing"></i>
                <span @click="push3">报警管理</span>
            </template>
            <el-menu-item index="/alarm_info">警报信息</el-menu-item>
        </el-submenu>
        <el-submenu index="6">
            <template slot="title">
              <i class="icon iconfont iconshexiangji"></i>
                <span @click="push4">实时监控</span>
            </template>
            <el-menu-item index="/collect_info">采集信息</el-menu-item>
            <el-menu-item index="/analyzeInfo">分析数据</el-menu-item>
        </el-submenu>
        <el-submenu index="7">
            <template slot="title">
              <i class="icon iconfont icondaibanshixiang"></i>
                <span @click="push5">任务管理</span>
            </template>
            <el-menu-item index="/task/IA_Library">智能分析库</el-menu-item>
            <el-menu-item index="/task/DP_Library">数据处理库</el-menu-item>
            <el-menu-item index="/task/Model_file">模型文件</el-menu-item>
            <el-menu-item index="/task/taskmanager">任务管理</el-menu-item>
        </el-submenu> -->
        </el-menu>
  </div>
</template>
<script>
export default {
  data() {
    return {
      menus: [
        {
          id:'1',
          key:'/main',
          name:'首页',
          icon:'iconshiyongwendang',
        },
        {
          id: '2',
          key: '/farm_info',
          name: '农场管理',
          icon:'iconyunyingzhongxin',
          children: [
            {
              id: '2-1',
              key: '/site_info',
              name: '场地管理'
            },
            {
              id: '2-2',
              key: '/product_info',
              name: '产品管理'
            },
          ]
        },
        {
          id:'3',
          key:'/device_info',
          name:'设备管理',
          icon:'iconyunyingzhongxin',
          children:[
            {
              id:'3-1',
              key:'/device_info',
              name:'设备状况',
            },
            {
              id:'3-2',
              key:'/parts_info',
              name:'零件状况',
            }
          ]
        },
        {
          id:'4',
          key:'/user_info',
          name:'用户管理',
          icon:'iconhezuohuobanmiyueguanli',
          children:[
            {
              id:'4-1',
              key:'/user_info',
              name:'用户状况',
            }
          ]
        },
        {
          id:'5',
          key:'/system_parameter',
          name:'系统管理',
          icon:'icongongnengdingyi',
          children:[
            {
              id:'5-1',
              key:'/system_parameter',
              name:'系统参数',
            },
            {
              id:'5-2',
              key:'/runtime',
              name:'运行管理',
            },
            {
              id:'5-3',
              key:'/updata',
              name:'升级管理',
            }
          ],
        },
        {
          id:'6',
          key:'/alarm_info',
          name:'报警管理',
          icon:'icongaojing',
          children:[
            {
              id:'6-1',
              key:'/alarm_info',
              name:'警报信息',
            }
          ]
        },
        {
          id:'7',
          key:'/collect_info',
          name:'实时监控',
          icon:'iconshexiangji',
          children:[
            {
              id:'7-1',
              key:'/collect_info',
              name:'采集信息',
            },
            {
              id:'7-2',
              key:'/analyzeInfo',
              name:'分析数据',
            }
          ]
        },
        {
          id:'8',
          key:'/task/IA_Library',
          name:'任务管理',
          icon:'icondaibanshixiang',
          children:[
            {
              id:'8-1',
              key:'/task/IA_Library',
              name:'智能分析库',
            },
            {
              id:'8-2',
              key:'/task/DP_Library',
              name:'数据处理库',
            },
            {
              id:'8-3',
              key:'/task/Model_file',
              name:'模型文件',
            },
            {
              id:'8-4',
              key:'/task/taskmanager',
              name:'任务管理'
            }
          ]
        }
      ]
    }
  },
  methods:{
    naviagte (key) {
      this.$router.push(key)
    },
  }
}
</script>

<style scoped>
.iconfont{
    font-size: 20px;
}

.leftnav{
  opacity:0.7;
}
.el-menu-demo{
  width: 250px;
  height: 792px;
}

</style>

